<template>
	<view class="goods_list">
		<view v-for="(item, index) in goodsList" :key="index" @click="handleClick(item.goods_id)"><my-goods :goods="item"></my-goods></view>
	</view>
</template>

<script lang="ts" setup>
import { onLoad, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app';
import { reactive, toRefs } from 'vue';
interface GoodsItem {
	add_time: number;
	cat_id: number;
	cat_one_id: number;
	cat_three_id: number;
	cat_two_id: number;
	goods_big_logo: string;
	goods_id: number;
	goods_name: string;
	goods_number: number;
	goods_price: number;
	goods_small_logo: string;
	goods_weight: number;
	hot_mumber: number;
	is_promote: false;
	upd_time: number;
}
interface QueryObj {
	pagenum: number;
	total: number;
	pagesize: number;
	query: string;
	cid: string;
}
onLoad(res => {
	queryObj.value.query = res.query || '';
	queryObj.value.cid = res.id || '';
	getGoodsList();
});
onReachBottom(() => {
	if (isLoading.value) return;
	const maxLoad = queryObj.value.pagenum * queryObj.value.pagesize >= queryObj.value.total;
	if (maxLoad) return uni.$showMsg('数据加载完毕');
	queryObj.value.pagenum++;
	getGoodsList();
});
onPullDownRefresh(async () => {
	queryObj.value.pagenum = 1;
	getGoodsList(uni.stopPullDownRefresh);
});
const pageData = reactive<{ goodsList: GoodsItem[]; queryObj: QueryObj; isLoading: boolean }>({
	isLoading: false,
	goodsList: [],
	queryObj: {
		pagenum: 1,
		total: 0,
		pagesize: 10,
		query: '',
		cid: ''
	}
});
const { goodsList, queryObj, isLoading } = toRefs(pageData);
async function getGoodsList(cd?: () => void) {
	try {
		isLoading.value = true;
		const {
			data: {
				meta,
				message: { goods, pagenum, total }
			}
		} = await uni.$http.get('api/public/v1/goods/search', { ...queryObj.value });
		isLoading.value = false;
		cd && cd();
		if (meta.status !== 200) {
			return uni.$showMsg();
		}
		goodsList.value = goodsList.value.concat(goods);
		queryObj.value.pagenum = pagenum;
		queryObj.value.total = total;
	} catch (e) {
		isLoading.value = false;
	}
}
const handleClick = (goodsId: string) => {
	uni.navigateTo({
		url: '/subPak/goods_detail/goods_detail?goods_id=' + goodsId
	});
};
</script>

<style lang="scss">
.goods_list {
	background: #fff;
}
</style>
